document.addEventListener('DOMContentLoaded', function () {
    // 获取DOM元素
    const generatePlanBtn = document.getElementById('generatePlanBtn');
    const healthStatsSection = document.getElementById('healthStatsSection');
    const exercisePlansSection = document.getElementById('exercisePlansSection');
    const dietPlansSection = document.getElementById('dietPlansSection');

    // 获取用户信息
    const gender = document.getElementById('gender').textContent;
    const age = parseInt(document.getElementById('age').textContent);
    const height = parseFloat(document.getElementById('height').textContent);
    const weight = parseFloat(document.getElementById('weight').textContent);
    const goal = document.getElementById('goal').textContent;

    // 生成计划按钮点击事件
    generatePlanBtn.addEventListener('click', function () {
        // 生成健康计划推荐
        const recommendations = window.healthPlanRecommender.generateHealthPlanRecommendations(
            gender, age, height, weight, goal
        );

        // 显示健康数据
        document.getElementById('bmiValue').textContent = recommendations.userStats.bmi;
        document.getElementById('bmiCategory').textContent = recommendations.userStats.bmiCategory;
        document.getElementById('bmrValue').textContent = recommendations.userStats.bmr;
        document.getElementById('caloriesValue').textContent = recommendations.userStats.dailyCalories;
        document.getElementById('bmiAdvice').textContent = recommendations.bmiAdvice;

        // 显示运动计划
        const exercisePlansContainer = document.getElementById('exercisePlansContainer');
        exercisePlansContainer.innerHTML = ''; // 清空容器

        recommendations.exercisePlans.forEach(plan => {
            const planCard = document.createElement('div');
            planCard.className = 'col-md-6 mb-4';

            let scheduleHtml = '';
            plan.schedule.forEach(day => {
                let activitiesHtml = '';
                day.activities.forEach(activity => {
                    activitiesHtml += `<li>${activity}</li>`;
                });

                scheduleHtml += `
                    <div class="mb-2">
                        <strong>${day.day}:</strong>
                        <ul class="mb-0 ps-3">
                            ${activitiesHtml}
                        </ul>
                    </div>
                `;
            });

            planCard.innerHTML = `
                <div class="card h-100">
                    <div class="card-header bg-primary text-white">
                        <h5 class="mb-0">${plan.name}</h5>
                    </div>
                    <div class="card-body">
                        <p><strong>周期:</strong> ${plan.duration}</p>
                        <p><strong>描述:</strong> ${plan.description}</p>
                        <h6 class="mt-3">每周计划:</h6>
                        ${scheduleHtml}
                    </div>
                </div>
            `;

            exercisePlansContainer.appendChild(planCard);
        });

        // 显示饮食计划
        const dietPlansContainer = document.getElementById('dietPlansContainer');
        dietPlansContainer.innerHTML = ''; // 清空容器

        recommendations.dietPlans.forEach(plan => {
            const planCard = document.createElement('div');
            planCard.className = 'col-md-6 mb-4';

            let principlesHtml = '<ul class="ps-3">';
            plan.principles.forEach(principle => {
                principlesHtml += `<li>${principle}</li>`;
            });
            principlesHtml += '</ul>';

            let mealPlanHtml = '';
            for (const [meal, foods] of Object.entries(plan.mealPlan)) {
                let foodsHtml = '<ul class="ps-3">';
                foods.forEach(food => {
                    foodsHtml += `<li>${food}</li>`;
                });
                foodsHtml += '</ul>';

                let mealTitle = '';
                switch (meal) {
                    case 'breakfast':
                        mealTitle = '早餐';
                        break;
                    case 'lunch':
                        mealTitle = '午餐';
                        break;
                    case 'dinner':
                        mealTitle = '晚餐';
                        break;
                    case 'snacks':
                        mealTitle = '零食';
                        break;
                    default:
                        mealTitle = meal;
                }

                mealPlanHtml += `
                    <div class="mb-2">
                        <strong>${mealTitle}:</strong>
                        ${foodsHtml}
                    </div>
                `;
            }

            planCard.innerHTML = `
                <div class="card h-100">
                    <div class="card-header bg-success text-white">
                        <h5 class="mb-0">${plan.name}</h5>
                    </div>
                    <div class="card-body">
                        <p><strong>描述:</strong> ${plan.description}</p>
                        <h6 class="mt-3">饮食原则:</h6>
                        ${principlesHtml}
                        <h6 class="mt-3">膳食计划:</h6>
                        ${mealPlanHtml}
                    </div>
                </div>
            `;

            dietPlansContainer.appendChild(planCard);
        });

        // 显示所有部分
        healthStatsSection.classList.remove('d-none');
        exercisePlansSection.classList.remove('d-none');
        dietPlansSection.classList.remove('d-none');

        // 隐藏提示信息
        document.getElementById('infoAlert').classList.add('d-none');

        // 滚动到健康数据部分
        healthStatsSection.scrollIntoView({ behavior: 'smooth' });
    });
});